<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>签到</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/sigin_in.css"/>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a href="javascript:history.go(-1)" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">我的签到</h1>
    </header>
    <!--签到-->
    <div class="mui-content conter-c">
        	<div class="out out-1"  id="signIn">
        		<div class="out out-2">
        			<div class="out singin">
        				<strong id="sign-txt">签到</strong>
        				<span>已签到<em id="sign-count">0</em>天</span>
        			</div>
        		</div>
        	</div>
    </div>
   	<div class="mui-content conter-t">
   	    <div class="Calendar">
			<div id="toyear" class="flex flex-pack-center">
				<div class="year-month">
					<span id="idCalendarYear">2018</span>年<span id="idCalendarMonth">6</span>月
				</div>
			</div>
			<table border="1px" cellpadding="0" cellspacing="0">
				<thead>
					<tr class="tou">
						<td>日</td>
						<td>一</td>
						<td>二</td>
						<td>三</td>
						<td>四</td>
						<td>五</td>
						<td>六</td>
					</tr>
				</thead>
				<tbody id="idCalendar">
				</tbody>
			</table>
		</div>
   	</div> 
   
    <script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/sigin_in.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    mui.init()
    		var isSign = false;
			var myday = [19,21]; //已签到的数组
			
			var cale = new Calendar("idCalendar", {
				qdDay: myday,
				
				onToday: function(o,status) {
					o.className = "onToday";
				},
				onSignIn: function (){
					$$("sign-txt").innerHTML = '已签到';
				},
				onFinish: function() {
					$$("sign-count").innerHTML = myday.length //已签到次数
					$$("idCalendarYear").innerHTML = this.Year;
					$$("idCalendarMonth").innerHTML = this.Month; //表头年份
				}
			});
			//添加今天签到
			$$("signIn").onclick = function() {
				if(isSign == false) {
					$.ajax({
							type:"get",
							url:`?t=${new Date().getDate()}`,
							async:true,
							success(data){
								data = true 		//假设签到成功
								if(data){
									var res = cale.SignIn();//执行签到
									if(res == '1') {
										$$("sign-txt").innerHTML = '已签到';
										$$("sign-count").innerHTML = parseInt($$("sign-count").innerHTML) + 1;
										isSign = true;
										mui.toast('签到成功')
									} else if (res == '2'){
										$$("sign-txt").innerHTML = '已签到';
										mui.toast('今天已经签到了')
									}else{
										mui.toast('签到失败,请刷新重试')
									}
								}else{
									mui.toast('签到失败,请刷新重试')
								}
							},
							error(err){
								mui.toast('签到失败,请刷新重试')
							}
						});
				} else {
					mui.toast('今天已经签到了')
				}

			}
    </script>
</body>
</html>

